<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <title>创客注册</title>
	<link rel="stylesheet" href="__INDEX__/css/mui.min.css">
    <link rel="stylesheet" href="__INDEX__/css/style.css" />
    <link rel="stylesheet" href="__INDEX__/css/iconfont.css" />
    <link rel="stylesheet" href="__INDEX__/css/mall.css" />
    <style>
    	.sbtn {
    text-align: center;
    background: #2672e4;
    border: 1px solid #2672e4;
    color: #FFFFFF;
    width: 100%;
    font-size: .85rem;
    padding: .4rem 0;
    margin: 0;
    border-radius: 5px;
    display: inline-block;
}
    </style>
</head>
<body  style="background: url(__INDEX__/images/p6.jpg) no-repeat;background-size: 100% 100%;position: relative;height: auto;">
	<div class="mui-content" style="padding-bottom: 0;" >


	    <div class="zhuc_txbox" style="margin-top:240px;">
	    	<div class="zhuc_nrbox">
	    		<form id='login-form' class="login_formbox">
					<div class="mui-input-row">
						<label><span class="iconfont icon-dianhua"></span></label>
						<input id='mobile' name ='mobile' type="text" class="mui-input-clear mui-input" placeholder="请输入手机号码">
					</div>
					<div class="mui-input-row fl_yanzm">
						<div class="left clearfix">
							<label><span class="iconfont icon-ecurityCode"></span></label>
							<input id="yzm" name='yzm' type="text" class="mui-input-clear mui-input" placeholder="请输入验证码" data-input-clear="2">
						</div>
						<a href="javascript:;" id="send_code">获取验证码</a>
					</div>
					<div class="mui-input-row" style="padding-left: 10px;">
						<label><span class="iconfont icon-mima"></span></label>
						<input id='pwd' name= 'pwd' type="password" class="mui-input-clear mui-input" placeholder="请输入密码">
					</div>	
					<div class="sbtn" id="btn">确定</div>
					<input type="hidden" id='tj_id' value="{$fromuid}" name='tj_id'>
				</form>
	    	</div>
	    </div>
	   
	   
	</div>
</body>
</html>
<script type="text/javascript" src="/public/static/js/jquery.min.js"></script>
<script type="text/javascript" src="/public/static/js/jquery.form.js"></script>
<script type="text/javascript" src="/public/static/layui/layui.all.js"></script>
<script>
	var onoff = true;
	//获取验证码
	$('#send_code').click(function() {
		//false就不能发送
		if(!onoff) {
			return;
		}
		onoff = false;
		//点击玩按钮干什么?
		//发验证码? 
		// 1-给谁发? 手机号码
		var phone = $("#mobile").val();
		
		if(phone == '') {
			layer.msg('手机号码不能为空');
			onoff = true;
			return;
		}
		var reg = /^1[0-9]{10}$/; //验证规则
		if(!reg.test(phone)) {
			layer.msg('手机号码格式不正确');
			onoff = true;
			return;
		}
		$.ajax({
			type:"post",
			//请求的url
			//注意，如果我们使用路由器的情况下，我们需要设置一下本地服务器的ip地址
			url: "{:url('index/member/verify_code')}",
			//请求的过程中传递过去的参数 json
			data: {
				mobile: phone,
			},
			//成功了的回调，并且带有返回值
			success: function(data) {
				layer.msg(data.msg);
				var num = 60;
				var timer = setInterval(function() {
					num--;
					if(num == 0) {
						$('#send_code').text('发送验证码');
						//定时器停了
						clearInterval(timer);
						onoff = true;
					} else {
						$('#send_code').text(num + 'S');
					}
				}, 1000); // 1000 毫秒==1秒
			}
		})
	});
	
	//提交请求
	$('#btn').click(function() {
		var phone = $("#mobile").val();
		var input_code = $("#yzm").val();
		var tj_id = $("#tj_id").val();
		
		if(phone == '') {
			layer.msg('手机号码不能为空');
			return;
		}
		var reg = /^1[0-9]{10}$/; //验证规则
		if(!reg.test(phone)) {
			layer.msg('手机号码格式不正确');
			onoff = true;
			return;
		}
		if(input_code.trim() == '') {
			layer.msg('验证码不能为空');
			return;
		}
		
		btn.disabled = true;
		setTimeout(function() {
			btn.disabled = false;
		}, 1500);
		//写入数据库
		$.ajax({
			type:"post",
			url: "{:url('index/member/regist')}",
			data: $('#login-form').serialize(),//表单数据
			success: function(data) {
				layer.msg(data.msg, {
				  icon: 1,
				  time: 1500 //2秒关闭（如果不配置，默认是3秒）
				}, function(){
					  if(data.code == 200) {
							window.location="/index/index/hyty";
					  }else{
					  	layer.msg('注册失败');
					  }
				}); 
			}
		})
	});
</script>